<!DOCTYPE html>
<html>
<head>
  <title>SVG target</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link href="../assets/css/styles.css" rel="stylesheet">
  <link href="./assets/onscroll.css" rel="stylesheet">
  <style>
    .log {
      position: fixed;
      z-index: 10;
      overflow-y: scroll;
      width: 22ch;
      height: 20ch;
      padding-left: 1ch;
      padding-right: 1ch;
      font-family: ui-monospace, monospace;
      white-space: pre;
      background-color: rgba(0, 0, 0, .5);
    }

    body {
      display: flex;
      flex-wrap: nowrap;
    }

    .container {
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      flex-grow: 1;
      flex-shrink: 0;
    }

    .section {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-shrink: 0;
      width: 100vw;
      height: 100lvh;
      border: 1px dotted var(--green);
    }

    body {
      overflow-y: scroll;
    }
    body .container.grid {
      height: 300lvh;
      flex-direction: column;
    }
  </style>
</head>
<body>
  <div class="container grid">
    <div class="section">
    </div>
    <div class="section">
      <div class="logo">
        <svg class="logo" xmlns="http://www.w3.org/2000/svg" width="371" height="64" viewBox="0 0 371 64"><g fill="none" fill-rule="evenodd"><path fill="#FFF" fill-rule="nonzero" d="M15.4913443 51.8174865C11.6310417 51.8174865 8.58541332 51.5417506 6.3544592 50.9902788 4.12350508 50.438807 2.50669002 49.5363986 1.50401401 48.2830536.501338004 47.0297086 0 45.3251593 0 43.1694059 0 42.2168637.0752007006 41.2643215.225602102 40.3117793L.451204204 38.6573639C.852274607 35.8498711 1.62934851 33.7191845 2.78242592 32.2653043 3.93550333 30.8114241 5.74032015 29.7836812 8.19687637 29.1820756 10.6534326 28.58047 14.1627986 28.2796672 18.7249745 28.2796672L20.2289885 28.2796672C23.7884883 28.2796672 26.5709142 28.5428697 28.5762662 29.0692746 30.5816183 29.5956795 32.0354985 30.4604875 32.9379069 31.6636987L33.163509 31.6636987 33.5395125 28.1292658C33.6397801 27.2268574 33.6899139 26.6503187 33.6899139 26.3996497 33.6899139 25.1964385 33.4392449 24.319097 32.9379069 23.7676252 32.4365689 23.2161534 31.6720284 22.8526833 30.6442855 22.677215 29.6165426 22.5017467 28.0999951 22.4140126 26.0946431 22.4140126L24.5906291 22.4140126C22.2343405 22.4140126 20.4420571 22.5268136 19.213779 22.7524157 17.9855009 22.9780178 17.1332263 23.3289544 16.6569552 23.8052255 16.1806841 24.2814966 15.8673478 24.9457695 15.7169464 25.7980441L15.6417457 26.0236462 3.15842943 26.0236462 3.30883083 24.8956357C3.70990123 22.038009 4.62484309 19.8822556 6.0536564 18.4283754 7.48246971 16.9744952 9.73849073 15.9592857 12.8217195 15.382747 15.9049482 14.8062083 20.3292561 14.517939 26.0946431 14.517939L27.8994599 14.517939C32.662171 14.517939 36.3595388 14.8312752 38.9915633 15.4579477 41.6235878 16.0846203 43.5537391 17.2251642 44.7820172 18.8795796 46.0102953 20.533995 46.6244344 22.9654844 46.6244344 26.1740476 46.6244344 27.4775264 46.4489661 29.4578115 46.0980295 32.1149029L43.3908043 51.2158809 30.3810831 51.2158809 31.0578894 47.1550431 30.907488 47.1550431C29.8546781 48.3582543 28.8269352 49.2857296 27.8242592 49.937469 26.8215832 50.5892084 25.4930375 51.0654795 23.8386221 51.3662823 22.1842067 51.6670851 19.9281857 51.8174865 17.070559 51.8174865L15.4913443 51.8174865ZM22.4850095 43.7710115C25.1922347 43.7710115 27.1975867 43.6582105 28.5010655 43.4326084 29.8045443 43.2070063 30.7069528 42.8310028 31.2082908 42.3045979 31.7096288 41.778193 32.0354985 40.9885856 32.1858999 39.9357758L32.3363013 39.3341702C32.3864351 39.0835012 32.411502 38.7325646 32.411502 38.2813604 32.411502 37.5794872 32.1858999 37.0405488 31.7346957 36.6645453 31.2834915 36.2885418 30.4437503 36.0253394 29.2154722 35.874938 27.9871941 35.7245366 26.1698438 35.6493359 23.7634214 35.6493359L22.9362137 35.6493359C20.2289885 35.6493359 18.211103 35.7746704 16.8825573 36.0253394 15.5540116 36.2760084 14.6390697 36.6645453 14.1377317 37.1909502 13.6363937 37.7173551 13.310524 38.5069625 13.1601226 39.5597723L13.0849219 40.1613779 13.0097212 40.9133849C13.0097212 41.6653919 13.2854571 42.2544641 13.8369289 42.6806014 14.3884007 43.1067387 15.2782757 43.395008 16.5065538 43.5454094 17.7348319 43.6958108 19.4769815 43.7710115 21.7330025 43.7710115L22.4850095 43.7710115ZM52.6983371 15.1195446 65.9336604 15.1195446 65.031252 20.7595971 65.1816534 20.7595971C66.284597 19.2054493 67.5003417 17.9771712 68.8288874 17.0747628 70.1574331 16.1723544 71.7366478 15.520615 73.5665316 15.1195446 75.3964153 14.7184742 77.6399028 14.517939 80.2969943 14.517939L80.9738006 14.517939C84.884237 14.517939 88.0175995 14.8939425 90.3738881 15.6459495 92.7301768 16.3979565 94.4723263 17.6763684 95.6003368 19.4811852 96.7283473 21.286002 97.2923526 23.7425583 97.2923526 26.8508539 97.2923526 28.1543327 97.1670181 29.8839488 96.9163491 32.0397022L94.1339232 51.2158809 80.8985999 51.2158809 83.5306244 32.4909064C83.6810258 31.4380966 83.7562265 30.5356882 83.7562265 29.7836812 83.7562265 28.329801 83.4804906 27.2393908 82.9290188 26.5124507 82.377547 25.7855106 81.5252724 25.2967061 80.372195 25.0460371 79.2191176 24.7953681 77.6148359 24.6700336 75.5593501 24.6700336L74.7321424 24.6700336C72.1251848 24.6700336 70.0446321 24.9708364 68.4904843 25.572442 66.9363365 26.1740476 65.7707256 27.0889894 64.9936517 28.3172676 64.2165778 29.5455457 63.6776394 31.1874276 63.3768366 33.2429134L60.8200128 51.2158809 47.5846895 51.2158809 52.6983371 15.1195446Z"/><polygon fill="#FFF" fill-rule="nonzero" points="98.328 51.216 103.441 15.12 116.677 15.12 111.563 51.216"/><path fill="#FFF" fill-rule="nonzero" d="M121.096267 15.1195446 134.33159 15.1195446 133.429182 20.7595971 133.579583 20.7595971C134.933196 18.8043789 136.712946 17.275298 138.918833 16.1723544 141.12472 15.0694108 143.95728 14.517939 147.416512 14.517939L148.31892 14.517939C152.53016 14.517939 155.701122 15.132078 157.831809 16.3603562 159.962495 17.5886343 161.353708 19.5814528 162.005448 22.3388119L162.080649 22.3388119C163.484395 19.7318542 165.452147 17.776636 167.983904 16.4731572 170.51566 15.1696784 173.736757 14.517939 177.647194 14.517939L178.474401 14.517939C182.033901 14.517939 184.853927 14.8688756 186.93448 15.5707488 189.015033 16.272622 190.53158 17.4507663 191.484122 19.1051817 192.436665 20.7595971 192.912936 23.0406851 192.912936 25.9484455 192.912936 27.3020581 192.737467 29.332477 192.386531 32.0397022L189.679306 51.2158809 176.443982 51.2158809 179.151208 32.4157057C179.301609 31.3628959 179.37681 30.4604875 179.37681 29.7084805 179.37681 28.3548679 179.138674 27.3145915 178.662403 26.5876514 178.186132 25.8607113 177.496792 25.3593733 176.594384 25.0836374 175.691975 24.8079015 174.488764 24.6700336 172.98475 24.6700336L172.232743 24.6700336C169.675919 24.6700336 167.708168 24.9457695 166.329488 25.4972413 164.950809 26.0487131 163.960666 26.9135211 163.35906 28.0916655 162.757455 29.2698098 162.306251 30.9367586 162.005448 33.092512L159.448624 51.2158809 146.213301 51.2158809 148.845325 32.4157057C148.995727 31.7138325 149.070927 30.836491 149.070927 29.7836812 149.070927 28.3799348 148.832792 27.3020581 148.356521 26.5500511 147.88025 25.7980441 147.203443 25.2967061 146.326102 25.0460371 145.44876 24.7953681 144.283149 24.6700336 142.829269 24.6700336L142.077262 24.6700336C139.470305 24.6700336 137.490019 24.9457695 136.136407 25.4972413 134.782794 26.0487131 133.792652 26.9009877 133.165979 28.0540651 132.539307 29.2071425 132.075569 30.9116917 131.774766 33.1677127L129.217942 51.2158809 115.982619 51.2158809 121.096267 15.1195446ZM215.357453 51.8174865C210.394206 51.8174865 206.471236 51.4665499 203.588543 50.7646767 200.705849 50.0628035 198.562629 48.7843916 197.158883 46.929441 195.755137 45.0744903 195.053263 42.4173989 195.053263 38.9581667 195.053263 37.0029485 195.178598 35.2231986 195.429267 33.6189169L195.579668 32.1901036C196.281542 27.1767236 197.484753 23.4166886 199.189302 20.9099985 200.893851 18.4033085 203.262673 16.7112928 206.295768 15.8339512 209.328863 14.9566097 213.552636 14.517939 218.967086 14.517939L221.298308 14.517939C225.960751 14.517939 229.708253 14.8438087 232.540813 15.4955481 235.373372 16.1472875 237.491525 17.3254318 238.895272 19.029981 240.299018 20.7345302 241.000892 23.1158858 241.000892 26.1740476 241.000892 27.6279278 240.900624 28.9815404 240.700089 30.2348854L239.948082 35.874938 208.062985 35.874938 207.912583 37.0781492C207.762182 37.8301562 207.686981 38.4568287 207.686981 38.9581667 207.686981 40.2616455 208.000317 41.2267212 208.62699 41.8533937 209.253662 42.4800662 210.156071 42.89367 211.334215 43.0942052 212.512359 43.2947404 214.229442 43.395008 216.485463 43.395008L217.914276 43.395008C220.370833 43.395008 222.238317 43.2571401 223.516729 42.9814042 224.795141 42.7056683 225.697549 42.279531 226.223954 41.7029923 226.750359 41.1264536 227.088762 40.3117793 227.239163 39.2589695L227.239163 39.1085681 239.647279 39.1085681 239.496877 40.2365786C239.045673 43.3448742 238.005397 45.7262297 236.376048 47.3806452 234.7467 49.0350606 232.465612 50.188138 229.532785 50.8398774 226.599957 51.4916168 222.727121 51.8174865 217.914276 51.8174865L215.357453 51.8174865ZM228.442374 29.0316742 228.592776 27.6780616C228.693044 27.327125 228.743177 26.825787 228.743177 26.1740476 228.743177 25.1713716 228.492508 24.4068311 227.99117 23.8804262 227.489832 23.3540213 226.675158 22.9780178 225.547148 22.7524157 224.419137 22.5268136 222.827389 22.4140126 220.771903 22.4140126L219.267889 22.4140126C216.610798 22.4140126 214.592912 22.6145478 213.214233 23.0156182 211.835553 23.4166886 210.845411 24.068428 210.243805 24.9708364 209.642199 25.8732448 209.216062 27.2268574 208.965393 29.0316742L228.442374 29.0316742ZM236.9227 64C235.819756 64 234.917348 63.9498662 234.215474 63.8495986L234.441077 62.5711867C235.243217 62.6714543 236.120559 62.7215881 237.073101 62.7215881 238.276312 62.7215881 239.216321 62.4834525 239.893127 62.0071814 240.569934 61.5309103 241.121405 60.6911692 241.547543 59.487958 241.97368 58.2847468 242.362217 56.5049968 242.713154 54.1487082L248.202805 15.1195446 249.782019 15.1195446 244.292368 54.2239089C243.941432 56.6804651 243.490228 58.6106165 242.938756 60.0143629 242.387284 61.4181093 241.635277 62.4333187 240.682735 63.0599912 239.730192 63.6866637 238.476847 64 236.9227 64ZM269.71599 51.7422858C264.552208 51.7422858 260.666839 51.554284 258.059881 51.1782805 255.452924 50.802277 253.597973 50.0878704 252.495029 49.0350606 251.392086 47.9822508 250.840614 46.3529023 250.840614 44.147015 250.840614 43.4451418 250.878214 42.8059359 250.953415 42.2293972 251.028616 41.6528585 251.11635 41.0387194 251.216617 40.38698L252.795832 40.38698C252.545163 41.7405926 252.419829 42.9438038 252.419829 43.9966136 252.419829 45.8014304 252.908633 47.1425096 253.886242 48.0198511 254.863851 48.8971926 256.543334 49.4987982 258.924689 49.8246679 261.306045 50.1505376 264.903145 50.3134725 269.71599 50.3134725L272.348014 50.3134725C276.759789 50.3134725 280.118753 50.0377366 282.424908 49.4862648 284.731063 48.934793 286.360412 48.0825184 287.312954 46.929441 288.265496 45.7763635 288.892168 44.1219481 289.192971 41.9661947 289.393506 40.7128497 289.493774 39.6851068 289.493774 38.882966 289.493774 37.378952 289.030036 36.238408 288.102561 35.4613341 287.175086 34.6842602 285.52067 34.1453219 283.139315 33.844519 280.757959 33.5437162 277.185926 33.3682479 272.423215 33.3181141 267.560236 33.2679803 263.862869 33.0298448 261.331112 32.6037075 258.799355 32.1775702 257.044672 31.5132973 256.067063 30.6108889 255.089454 29.7084805 254.600649 28.4300686 254.600649 26.7756532 254.600649 26.0236462 254.725983 24.8705688 254.976652 23.316421 255.277455 21.0102661 255.966795 19.2430497 257.044672 18.0147716 258.122548 16.7864935 259.914832 15.9091519 262.421522 15.382747 264.928212 14.8563421 268.587979 14.5931397 273.400824 14.5931397L275.280842 14.5931397C279.592348 14.5931397 282.926246 14.8187418 285.282535 15.269946 287.638823 15.7211502 289.343373 16.4982241 290.396182 17.6011677 291.448992 18.7041113 291.975397 20.283326 291.975397 22.3388119 291.975397 23.1409527 291.87513 24.319097 291.674594 25.8732448L290.17058 25.8732448C290.371116 24.4694984 290.471383 23.316421 290.471383 22.4140126 290.471383 20.7094633 290.007646 19.4059845 289.08017 18.5035761 288.152695 17.6011677 286.611081 16.9619618 284.455327 16.5859583 282.299574 16.2099548 279.216345 16.021953 275.205641 16.021953L273.325623 16.021953C268.813581 16.021953 265.417016 16.2600886 263.135929 16.7363597 260.854841 17.2126308 259.250559 17.9646378 258.323084 18.9923807 257.395608 20.0201236 256.781469 21.5617379 256.480666 23.6172238 256.280131 24.9207026 256.179864 25.8983117 256.179864 26.5500511 256.179864 27.9537975 256.618534 29.0191408 257.495876 29.7460809 258.373217 30.473021 259.964966 30.9868924 262.27112 31.2876952 264.577275 31.588498 268.011441 31.7639663 272.573616 31.8141001 277.586996 31.8642339 281.384632 32.089836 283.966523 32.4909064 286.548413 32.8919768 288.365764 33.5687831 289.418573 34.5213254 290.471383 35.4738676 290.997788 36.877614 290.997788 38.7325646 290.997788 39.5347054 290.89752 40.6627159 290.696985 42.1165961 290.346049 44.6232861 289.606575 46.5534375 288.478565 47.9070501 287.350554 49.2606627 285.52067 50.2382718 282.988913 50.8398774 280.457157 51.441483 276.885123 51.7422858 272.272814 51.7422858L269.71599 51.7422858Z"/><path fill="#FF4B4B" fill-rule="nonzero" d="M340.895986,63.5235732 L342.670909,50.7254415 L295.868983,50.7254415 L298.578076,31.2947015 L345.193169,0 L366.865917,0 L361.541147,37.6470588 L370.789432,37.6470588 L368.921092,50.7254415 L359.672807,50.7254415 L357.897884,63.5235732 L340.895986,63.5235732 Z M312.403795,37.6470588 L344.53925,37.6470588 L347.902262,13.8257189 L347.622011,13.8257189 L312.403795,37.3668078 L312.403795,37.6470588 Z"/><polygon fill="#FF4B4B" fill-rule="nonzero" points="301.579 10.307 303.083 .079 316.318 .079 314.889 10.307"/></g></svg>
      </div>
    </div>
    <div class="section">
    </div>
  </div>
  <script type="module" src="./assets/svg-target.js"></script>
</body>
</html>
